<template>
    <div class="Zky_Error">
        <img :src="ImgUrl">
        <div>
            <!-- <slot></slot> -->
            <span>{{ title }}</span>
        </div>
    </div>
</template>

<script setup lang="ts">
import { ref, watch } from "vue"
const ImgUrl = ref("https://gw.alipayobjects.com/mdn/miniapp_social/afts/img/A*pevERLJC9v0AAAAAAAAAAABjAQAAAQ/original")
const title = ref("当前暂无数据")
const prop = defineProps(["url", "title"])
watch([() => prop.url, () => prop.title], () => {
    init()
})
const init = () => {
    if (prop.url) {
        ImgUrl.value = prop.url
    }
    if (prop.title) {
        title.value = prop.title
    }
}
init()
</script>

<style scoped lang="scss">
.Zky_Error {
    margin: 20px 0;
    width: 100%;
    height: auto;
    text-align: center;

    img {
        width: 30%
    }
}
</style>